<template>
	<view>
		<uni-card class="card1" v-if="!isLoginFlag">
			<!-- //用户头像，登录 -->
			<image src="/static/userface.png" style="width: 150rpx;height: 150rpx;"></image>
			<button @click="login()" plain=true hover-class="hover">登录/注册</button>
		</uni-card>
		<uni-card class="card1" v-else>
			<!-- //用户头像，登录 -->
			<image src="/static/userface.png" style="width: 150rpx;height: 150rpx;"></image>
			<view>个人详情</view>
		</uni-card>
		<uni-card class="card2">
			<!-- //待发货，已发货，待收货，已完成 -->
			<uni-row>
				<uni-col :span="12">
					<h3>订单中心</h3>
				</uni-col>
				<uni-col :span="3" :offset="9">
					<view>全部<uni-icons type="right" @click="queryOrderByExample(0)"></uni-icons></view>
				</uni-col>
			</uni-row>
			<br />
			<uni-row >
				<view style="text-align: center;">
				<uni-col :span="6" >
					<view><uni-icons type="wallet-filled" color="#ff9336" size="100rpx" @click="queryOrderByExample(1)"></uni-icons></view>
					<view >待付款</view>
				</uni-col>
				<uni-col :span="6" >
					<view><uni-icons type="upload-filled" color="#009be8" size="100rpx" @click="queryOrderByExample(2)"></uni-icons></view>
					<view >待发货</view>
				</uni-col>
				<uni-col :span="6">
					<view><uni-icons type="download-filled" color="#00d1ff" size="100rpx" @click="queryOrderByExample(3)"></uni-icons></view>
					<view >待收货</view>
				</uni-col>
				<uni-col :span="6">
					<view><uni-icons type="tune-filled" color="#e60000" size="100rpx" @click="refund()"></uni-icons></view>
					<view >退款/售后</view>
				</uni-col>
				</view>
			</uni-row>
			
		</uni-card>
		<uni-card class="card3">
			<!-- //功能 -->
			<uni-row >
				<view style="text-align: center;margin-top: 50rpx">
				<uni-col :span="6" >
					<view><uni-icons type="cart-filled" color="#ff9336" size="100rpx" @click="cart()"></uni-icons></view>
					<view >购物车</view>
				</uni-col>
				<uni-col :span="6" >
					<view><uni-icons type="location-filled" color="#009be8" size="100rpx" @click="myAddr()"></uni-icons></view>
					<view >我的地址</view>
				</uni-col>
				<uni-col :span="6" >
					<view><uni-icons type="location-filled" color="#009be8" size="100rpx" @click="map()"></uni-icons></view>
					<view >地图</view>
				</uni-col>
				</view>
			</uni-row>
		</uni-card>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isLoginFlag:false,
				user:{id:"",userAccount:"",userName:"",userPhone:"",userImg:""}
			}
		},
		methods: {
			cart(){
				uni.navigateTo({
					url:'/pages/shoppingCart/shoppingCart'
				})
			},
			login(){
				uni.navigateTo({
					url:"/pages/login/login"
				})
			},
			isLogin(){
				uni.request({
					url:'api/custom-server/isLogin',
					success: (res) => {
						if(res.data.code == 200){
							this.isLoginFlag = true;
							this.user = res.data.data;
						}
					}
				})
			},
			
			queryOrderByExample(state){
				uni.navigateTo({
					url:'/pages/orderDetail/orderDetail?state='+state
				})
				
				
			},
			//退款/售后
			refund(){
				uni.navigateTo({
					url:'/pages/Shouhou/Shouhou'
				})	
				
			},
			myAddr(){
				uni.navigateTo({
					url:'/pages/myAddr/myAddr'
				})
			},
			//地图
			map(){
				uni.navigateTo({
					url:'/pages/map/map'
				})
			}
		},
		created(){
			this.isLogin();
			uni.getStorageInfoSync("jwt")
		}
	}
</script>

<style>
.card1{
	background-color: aquamarine;
	text-align: center;
}
.card2{
	
}
.card3{
	
}
.hover{
	background-color: rgba(0, 0, 0, 0.1);
	 opacity: 0.7;
}
</style>
